<template>
  <div class="masterlist" v-loading="loading" ref="masterlist">
    <!-- 返回顶部按钮 -->
    <el-backtop :right="40" :bottom="100" ref="toTop"></el-backtop>
    <!-- 返回顶部按钮 end -->
    <div class="share-header flex-row justify-content-center">
      <!-- <div class="user_box">
        <el-avatar size="large" :src="userInfo.avatar" shape="square"></el-avatar>
        <div>{{userInfo.nickname}}</div>
        <div></div>
      </div>-->
      <div>
        <div class="share-header-title">{{ BonusData.bonus_amount }}</div>
        <div>当前奖金池</div>
        <el-button
          type="warning"
          plain
          round
          size="mini"
          class="look_btn"
          @click="ShowRightDrawer"
          >查看奖金池</el-button
        >
        <div class="href_rule">
          <el-link :href="MasterRule" target="_blank">规则</el-link>
        </div>
      </div>
    </div>
    <div class="type">
      <!-- 类型选择 -->
      <div>
        <div class="type_item_box">
          <el-radio-group v-model="FirstLevelRadio" @change="FirstLevelChange">
            <el-radio-button
              :label="index"
              v-for="(item, index) in typeList"
              :key="index"
              >{{ item.name }}</el-radio-button
            >
          </el-radio-group>
        </div>
        <div class="type_item_box">
          <el-radio-group
            v-model="SecondaryRadio"
            @change="SortOrViewOrStatusRadioChange"
          >
            <el-radio-button
              :label="index"
              v-for="(item, index) in typeList[LevelIndex].sub_arr"
              :key="index"
              >{{ item.name }}</el-radio-button
            >
          </el-radio-group>
        </div>
      </div>
      <!-- 类型选择end -->
      <!-- 排序 状态  查看 -->
      <div class="flex-row align-items-center justify-content-center">
        <div class="status_box">
          <span>排序：</span>
          <el-radio-group
            v-model="SortIndexRadio"
            @change="SortOrViewOrStatusRadioChange"
          >
            <el-radio :label="0" size="mini">最新发表</el-radio>
            <el-radio :label="1">正确率</el-radio>
          </el-radio-group>
        </div>
        <div class="status_box">
          <span>状态：</span>
          <el-radio-group
            v-model="StatusIndexRadio"
            @change="SortOrViewOrStatusRadioChange"
          >
            <el-radio :label="0">全部</el-radio>
            <el-radio :label="1">只看免费</el-radio>
            <el-radio :label="2">只看收费</el-radio>
          </el-radio-group>
        </div>
        <div class="status_box">
          <span>查看：</span>
          <el-radio-group
            v-model="ViewIndexRadio"
            @change="SortOrViewOrStatusRadioChange"
          >
            <el-radio :label="0">全部人</el-radio>
            <el-radio :label="1">关注的人</el-radio>
          </el-radio-group>
        </div>
      </div>
      <!-- 排序 状态  查看 end -->
      <div class="flex-row justify-content-between center_box">
        <!-- 粉丝，关注，预测记录 -->
        <div class="center_box_left">
          <div class="flex-column align-items-center">
            <div
              class="flex-row align-items-center justify-content-between user_info_item"
            >
              <!-- 用户资料 -->
              <div class="flex-row">
                <el-avatar
                  size="large"
                  :src="MasterCenterDetail.avatar"
                  shape="square"
                ></el-avatar>
                <div class="user_name">
                  <div class="nickname">
                    昵称：{{ MasterCenterDetail.nickname }}
                  </div>
                  <div class="flex-row align-items-center">
                    <img
                      class="level_icon_1"
                      :src="
                        require(`../../assets/${
                          MasterCenterDetail.level == 1
                            ? 'bronze_icon'
                            : MasterCenterDetail.level == 2
                            ? 'silver_icon'
                            : MasterCenterDetail.level == 3
                            ? 'gold_icon'
                            : 'default_icon'
                        }.png`)
                      "
                      alt
                    />
                    <div>{{ MasterCenterDetail.level_name }}</div>
                  </div>
                </div>
              </div>
              <!-- 用户资料 end-->
              <div>
                <el-button
                  type="info"
                  size="mini"
                  icon="el-icon-user"
                  v-show="!MasterCenterDetail.is_self"
                  @click="GetMineDetail()"
                  >我的详情</el-button>
                <el-button
                  type="primary"
                  icon="el-icon-edit"
                  size="mini"
                  @click="ShowDispatchDialog"
                  >发料</el-button>
               <el-popconfirm
                confirmButtonText='删除'
                cancelButtonText='不用了'
                confirmButtonType='danger'
                icon="el-icon-info"
                iconColor="red"
                :title="`确定删除【${typeList[UserCenterTypeFirst].name}-${typeList[UserCenterTypeFirst].sub_arr[UserCenterTypeSecond].name}】的战绩么`"
                v-show="MasterCenterDetail.is_self&&UserTabs==3"
                @onConfirm='ShowClearRecordDialog'
                >
                <el-button
                    type="info"
                    icon="el-icon-delete"
                    size="mini"
                    slot="reference"
                    style="margin-left:15px"
                >清除战绩</el-button>
                </el-popconfirm>
              </div>
            </div>
            <div class="flex-row align-items-center user_info_item">
              <div
                class="flex-row align-items-center dianzan"
                @click="
                  MasterCenterDetail.followed
                    ? Unfollow(
                        MasterCenterDetail.id,
                        MasterCenterDetail.is_self,
                        'usercenter'
                      )
                    : PostMemberFollow(
                        MasterCenterDetail.id,
                        MasterCenterDetail.is_self,
                        'usercenter'
                      )
                "
              >
                <el-rate
                  :value="
                    MasterCenterDetail.is_self
                      ? 1
                      : MasterCenterDetail.followed
                      ? 1
                      : 0
                  "
                  :max="1"
                ></el-rate>
                <span>{{
                  MasterCenterDetail.is_self
                    ? "已关注"
                    : MasterCenterDetail.followed
                    ? "已关注"
                    : "关注"
                }}</span>
              </div>
              <div
                class="flex-row align-items-center dianzan"
                @click="
                  !MasterCenterDetail.liked
                    ? MemberLikePost()
                    : MemberUnLikeDeletes()
                "
              >
                <img
                  class="zan_icon"
                  :src="
                    require(MasterCenterDetail.liked
                      ? '../../assets/great_icon.png'
                      : '../../assets/great_icon_no.png')
                  "
                  alt
                />
                <span>{{ MasterCenterDetail.likes }}</span>
              </div>
            </div>
            <div
              class="flex-row align-items-center justify-content-around user_info_item"
            >
              <div class="flex-column align-items-center grade_box_rankA">
                <div>关注</div>
                <div>{{ MasterCenterDetail.following }}</div>
              </div>
              <el-divider direction="vertical"></el-divider>
              <div class="flex-column align-items-center grade_box_rankA">
                <div>粉丝</div>
                <div>{{ MasterCenterDetail.followers }}</div>
              </div>
              <el-divider direction="vertical"></el-divider>
              <div class="flex-column align-items-center grade_box_rankA">
                <div>战绩</div>
                <div>
                  {{ MasterCenterDetail.join_count }}中{{
                    MasterCenterDetail.success_count
                  }}
                  {{ MasterCenterDetail.accuracy_ratio }}
                </div>
              </div>
            </div>
          </div>
          <div class="tabs_box">
            <el-tabs v-model="UserTabs" @tab-click="TabsClick" :stretch="true">
                <el-tab-pane label="战绩" name="3">
                    <div>
                    <!-- 战绩头部 -->
                    <div class="type_list">
                        <div
                        class="flex-row align-items-center flex_wrap_no fist_type"
                        style
                        >
                        <span
                            v-for="(item, index) in typeList"
                            :key="index"
                            class="fist_type_item"
                            @click="UserCenterTypeSelectFirst(index)"
                            :style="{
                            color: UserCenterTypeFirst == index ? '#F56C6C' : ''
                            }"
                            >{{ item.name }}</span
                        >
                        </div>
                        <div
                        class="flex-row align-items-center flex_wrap_no fist_type"
                        style
                        >
                        <span
                            v-for="(item, index) in typeList[UserCenterTypeFirst]
                            .sub_arr"
                            :key="index"
                            class="fist_type_item"
                            :style="{
                            color: UserCenterTypeSecond == index ? '#F56C6C' : ''
                            }"
                            @click="UserCenterTypeSelectSecond(index)"
                            >{{ item.name }}</span
                        >
                        </div>
                    </div>
                    <!-- 战绩头部end -->
                    <!-- 战绩数据 -->
                    <div>
                        <el-table
                        :data="UserCenterTableData"
                        height="300"
                        border
                        style="width: 100%"
                        size="mini"
                        @row-click="UserCenterShowBuyMaterialDialog"
                        >
                        <el-table-column
                            prop="stage"
                            label="期数"
                            width="60"
                        ></el-table-column>
                        <el-table-column prop="submit_value" label="内容">
                            <template slot-scope="scope">
                            <div style="text-align:center;">
                                <div>{{ scope.row.submit_value }}</div>
                                <div style="color:#F56C6C;">
                                开：{{
                                    scope.row.results === ""
                                    ? "?"
                                    : scope.row.results
                                }}
                                </div>
                            </div>
                            </template>
                        </el-table-column>
                        <!-- <el-table-column prop="results" label="开奖内容"></el-table-column> -->
                        <el-table-column prop="state" label="结果">
                            <template slot-scope="scope">
                            <div>
                                <div
                                :style="{
                                    color:
                                    scope.row.state == 0
                                        ? 'red'
                                        : scope.row.state == 1
                                        ? 'green'
                                        : '#ccc'
                                }"
                                style="text-align:center;"
                                >
                                <i class="el-icon-time"></i>
                                <span style="margin-left: 10px">{{
                                    scope.row.state == 0
                                    ? "待开奖"
                                    : scope.row.state == 1
                                    ? "猜对了"
                                    : "猜错了"
                                }}</span>
                                </div>
                                <div
                                style="text-align:center;font-size:10px;line-height:normal;"
                                >
                                {{ scope.row.created_at }}
                                </div>
                            </div>
                            </template>
                        </el-table-column>
                        <!-- <el-table-column prop="created_at" label="时间"></el-table-column> -->
                        </el-table>
                    </div>
                    <!-- 战绩数据 end -->
                    </div>
              </el-tab-pane>
              <el-tab-pane label="关注" name="1">
                <div>
                  <div v-for="(item, index) in FollowingData" :key="index">
                    <div
                      class="flex-row align-items-center justify-content-between fans_item"
                      @click="UserCenterGetMasterDetail(item.id)"
                    >
                      <div class="flex-row align-items-center">
                        <el-avatar size="medium" :src="item.avatar"></el-avatar>
                        <div style="margin-left:10px;">
                          <div style="text-align:left;margin-bottom:8px;">
                            {{ item.nickname }}
                          </div>
                          <div>
                            <el-tag
                              type="info"
                              size="mini"
                              style="margin-right:10px;"
                              >粉丝数：{{ item.following }}</el-tag
                            >
                            <el-tag type="info" size="mini"
                              >点赞数：{{ item.likes }}</el-tag
                            >
                            <!-- <div>粉丝数：{{item.following}}</div> -->
                            <!-- <div>点赞数：{{item.likes}}</div> -->
                          </div>
                        </div>
                      </div>
                      <el-button
                        :type="
                          item.is_self
                            ? 'success'
                            : item.has_followed
                            ? 'success'
                            : 'danger'
                        "
                        :icon="
                          item.is_self
                            ? 'el-icon-star-on'
                            : item.has_followed
                            ? 'el-icon-star-on'
                            : 'el-icon-star-off'
                        "
                        round
                        size="mini"
                        @click.prevent.stop
                        @click="
                          item.has_followed
                            ? Unfollow(item.id, item.is_self, 'usercenter')
                            : PostMemberFollow(
                                item.id,
                                item.is_self,
                                'usercenter'
                              )
                        "
                        >{{
                          item.is_self
                            ? "已关注"
                            : item.has_followed
                            ? "已关注"
                            : "关注"
                        }}</el-button
                      >
                      <!-- <el-button type="danger" icon="el-icon-star-on" round size="mini">关注</el-button> -->
                    </div>
                    <el-divider></el-divider>
                  </div>
                </div>
              </el-tab-pane>
              <el-tab-pane label="粉丝" name="2">
                <div>
                  <div v-for="(item, index) in FollowingData" :key="index">
                    <div
                      class="flex-row align-items-center justify-content-between fans_item"
                      @click="UserCenterGetMasterDetail(item.id)"
                    >
                      <div class="flex-row align-items-center">
                        <el-avatar size="medium" :src="item.avatar"></el-avatar>
                        <div style="margin-left:10px;">
                          <div style="text-align:left;margin-bottom:8px;">
                            {{ item.nickname }}
                          </div>
                          <div>
                            <el-tag
                              type="info"
                              size="mini"
                              style="margin-right:10px;"
                              >粉丝数：{{ item.following }}</el-tag
                            >
                            <el-tag type="info" size="mini"
                              >点赞数：{{ item.likes }}</el-tag
                            >
                            <!-- <div>粉丝数：{{item.following}}</div> -->
                            <!-- <div>点赞数：{{item.likes}}</div> -->
                          </div>
                        </div>
                      </div>
                      <el-button
                        :type="
                          item.is_self
                            ? 'success'
                            : item.has_followed
                            ? 'success'
                            : 'danger'
                        "
                        :icon="
                          item.is_self
                            ? 'el-icon-star-on'
                            : item.has_followed
                            ? 'el-icon-star-on'
                            : 'el-icon-star-off'
                        "
                        round
                        size="mini"
                        @click.prevent.stop
                        @click="
                          item.has_followed
                            ? Unfollow(item.id, item.is_self, 'usercenter')
                            : PostMemberFollow(
                                item.id,
                                item.is_self,
                                'usercenter'
                              )
                        "
                        >{{
                          item.is_self
                            ? "已关注"
                            : item.has_followed
                            ? "已关注"
                            : "关注"
                        }}</el-button
                      >
                      <!-- <el-button type="danger" icon="el-icon-star-on" round size="mini">关注</el-button> -->
                    </div>
                    <el-divider></el-divider>
                  </div>
                </div>

              </el-tab-pane>
              <el-tab-pane
                label="我的买料"
                name="4"
                v-if="MasterCenterDetail.is_self"
              >
                <div class="purchase_box">
                  <div
                    v-for="(listItem, listIndex) in PurchasesData"
                    :key="listIndex"
                    class="purchase_item"
                  >
                    <div class="text_left" style="color:#F56C6C;">
                      第{{ listItem.stage }}期
                    </div>
                    <div
                      v-for="(item, index) in PurchasesData[listIndex]
                        .purchase_arr"
                      :key="index"
                      class="purchase_item_box"
                    >
                      <div class="flex-row align-items-center item_header">
                        <el-avatar size="small" :src="item.avatar"></el-avatar>
                        <div style="margin-left:10px;">{{ item.nickname }}</div>
                      </div>
                      <div
                        v-for="(tItem, tIndex) in PurchasesData[listIndex]
                          .purchase_arr[index].purchase_list"
                        :key="tIndex"
                        class="flex-row t_item_p align-items-center"
                      >
                        <div class="t_item" style="width:25%;">
                          {{ tItem.category_name }}
                        </div>
                        <div class="t_item" style="width:55%;">
                          {{ tItem.submit_value }}
                        </div>
                        <div
                          class="t_item t_item_cost_amount"
                          style="width:20%;"
                        >
                          {{ tItem.cost_amount }}豆
                          <!-- v-show="tItem.state>0" -->
                          <div
                            class="state_box"
                            :style="{
                              borderColor:
                                listItem.is_newest?'':tItem.state == 1 ?  '#67C23A' : '#909399',
                              color: listItem.is_newest?'':tItem.state == 1 ?'#67C23A' : '#909399'
                            }"
                          >
                            {{listItem.is_newest?"":tItem.state == 1 ? "中奖" : "未中" }}
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="flex-row justify-content-between">
                      <div>
                        {{
                          listItem.all_back_amount > 0
                            ? `料未中返还：${listItem.all_back_amount}`
                            : ""
                        }}
                      </div>
                      <div class="total">
                        合计：{{ listItem.all_cost_amount }}
                      </div>
                    </div>
                  </div>
                </div>
              </el-tab-pane>
              <el-tab-pane
                label="我的卖料"
                name="5"
                v-if="MasterCenterDetail.is_self"
              >
                <div class="purchase_box">
                  <div
                    v-for="(listItem, listIndex) in PublishData"
                    :key="listIndex"
                    class="purchase_item"
                  >
                    <div class="text_left" style="color:#F56C6C;">
                      第{{ listItem.stage }}期
                    </div>
                    <div
                      v-for="(item, index) in PublishData[listIndex]
                        .publish_list"
                      :key="index"
                      class="purchase_item_box"
                    >
                      <div class="flex-row t_item_p align-items-center">
                        <div class="t_item" style="width:22%;">
                          {{ item.category_name }}
                        </div>
                        <div class="t_item" style="width:45%;">
                          {{ item.submit_value }}
                        </div>
                        <div class="t_item" style="width:13%;">
                          {{ item.buy_count }}人
                        </div>
                        <div
                          class="t_item t_item_cost_amount"
                          style="width:20%;"
                        >
                          {{ item.paid_amount }}豆
                          <!-- v-show="tItem.state>0" -->
                          <div
                            class="state_box"
                            :style="{
                              borderColor:
                                listItem.is_newest?'': item.state == 1 && !listItem.is_newest? '#67C23A' : '#909399',
                              color: listItem.is_newest?'': item.state == 1 && !listItem.is_newest? '#67C23A' : '#909399'
                            }"
                          >
                            {{listItem.is_newest?"": item.state == 1 && !listItem.is_newest? "中奖" : "未中" }}
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="flex-row justify-content-end">
                      <!-- <div>{{listItem.all_back_amount>0?`料未中返还：${listItem.all_back_amount}`:''}}</div> -->
                      <div class="total">
                        {{
                          listItem.is_newest
                            ? `预计可得 ${listItem.all_gain_amount} 欢乐豆`
                            : `实际获得 ${listItem.all_gain_amount} 欢乐豆`
                        }}
                      </div>
                    </div>
                  </div>
                </div>
              </el-tab-pane>
            </el-tabs>
            <el-pagination
              small
              layout="prev, pager, next"
              :total="FollowingMeta.total"
              :page-size="5"
              @current-change="UserCenterPaginationChange"
            ></el-pagination>
          </div>
        </div>
        <!-- 粉丝，关注，预测记录end -->
        <!-- 热门排行，经典排行列表 -->
        <div style="width:65%;">
          <div class="list_box">
            <!-- 热门高手 -->
            <div v-if="HotMasterList.length > 0">
              <div style="width:500px;margin:0 auto;">
                <el-divider>
                  <i class="el-icon-mobile-phone"></i>热门高手
                </el-divider>
              </div>
              <div>
                <el-collapse
                  v-model="HotMasterActiveNames"
                  @change="HotMasterHandleChange"
                  accordion
                >
                  <el-collapse-item
                    :name="index"
                    v-for="(item, index) in HotMasterList"
                    :key="index"
                  >
                    <template slot="title">
                      <div class="flex-row align-items-center">
                        <div
                          class="item_left"
                          @click="AvatarClick(item.member_id)"
                          @click.prevent.stop
                        >
                          <el-avatar
                            shape="square"
                            class="user_icon"
                            :src="item.avatar"
                          ></el-avatar>
                          <div
                            class="flex-row align-items-center"
                            style="margin:10px 0"
                          >
                            <div class="view_box">
                              <i class="el-icon-view"></i>
                              {{ item.views }}
                            </div>
                            <div
                              class="flex-row align-items-center"
                              @click="
                                item.followed
                                  ? Unfollow(item.member_id, item.is_self)
                                  : PostMemberFollow(
                                      item.member_id,
                                      item.is_self
                                    )
                              "
                              @click.prevent.stop
                            >
                              <el-rate
                                :value="item.followed ? 1 : 0"
                                :max="1"
                              ></el-rate>
                              <span>{{
                                item.followed ? "已关注" : "关注"
                              }}</span>
                            </div>
                          </div>
                          <div>{{ item.updated_at }}</div>
                        </div>
                        <div>
                          <div class="flex-row align-items-center">
                            <div class="nickname">{{ item.nickname }}</div>
                            <div class="flex-row align-items-center">
                              <!-- <img src="../../assets/gold_icon.png" alt=""> -->
                              <img
                                class="level_icon"
                                :src="
                                  require(`../../assets/${
                                    item.level == 1
                                      ? 'bronze_icon'
                                      : item.level == 2
                                      ? 'silver_icon'
                                      : item.level == 3
                                      ? 'gold_icon'
                                      : 'default_icon'
                                  }.png`)
                                "
                                alt
                              />
                              <div>{{ item.level_name }}</div>
                            </div>
                          </div>
                          <div class="record">
                            战绩:{{ item.join_count }}中{{ item.success_count }}
                            {{ item.accuracy_ratio }}
                          </div>
                          <div class="flex-row align-items-center">
                            <div class="max">
                              最多连对:{{ item.success_max }}
                            </div>
                            <div class="max">最多连错:{{ item.fail_max }}</div>
                            <div class="max">{{ item.submit_value }}</div>
                          </div>
                        </div>
                      </div>
                    </template>
                    <div>
                      <el-table
                        :data="tableData"
                        height="200"
                        border
                        style="width: 100%"
                        size="mini"
                        @row-click="ShowBuyMaterialDialog"
                      >
                        <el-table-column
                          prop="stage"
                          label="期数"
                        ></el-table-column>
                        <el-table-column
                          prop="submit_value"
                          label="预测内容"
                        ></el-table-column>
                        <el-table-column
                          prop="results"
                          label="开奖内容"
                        ></el-table-column>
                        <el-table-column prop="state" label="开奖结果">
                          <template slot-scope="scope">
                            <div
                              :style="{
                                color:
                                  scope.row.state == 0
                                    ? 'red'
                                    : scope.row.state == 1
                                    ? 'green'
                                    : '#ccc'
                              }"
                            >
                              <i class="el-icon-time"></i>
                              <span style="margin-left: 10px">{{
                                scope.row.state == 0
                                  ? "待开奖"
                                  : scope.row.state == 1
                                  ? "猜对了"
                                  : "猜错了"
                              }}</span>
                            </div>
                          </template>
                        </el-table-column>
                        <el-table-column
                          prop="created_at"
                          label="时间"
                        ></el-table-column>
                      </el-table>
                      <div style="margin-top:10px;">
                        <el-pagination
                          background
                          layout="prev, pager, next"
                          :total="recordsMeta.total"
                          @current-change="recordCurrentChange($event, 2)"
                          :page-size="10"
                        ></el-pagination>
                      </div>
                    </div>
                  </el-collapse-item>
                </el-collapse>
              </div>
              <div style="margin-top:20px;margin-bottom:50px;">
                <el-pagination
                  background
                  layout="prev, pager, next"
                  :total="hotMeta.total"
                  @current-change="handleCurrentChange($event, 1)"
                  :page-size="5"
                ></el-pagination>
              </div>
            </div>
            <!-- 热门高手 end -->
            <!-- 经典排行 -->
            <div>
              <div style="width:500px;margin:0 auto;">
                <el-divider>
                  <i class="el-icon-mobile-phone"></i>经典排行
                </el-divider>
              </div>
              <div>
                <el-collapse
                  v-model="activeNames"
                  @change="handleChange"
                  accordion
                >
                  <el-collapse-item
                    :name="index"
                    v-for="(item, index) in ClassicMasterList"
                    :key="index"
                  >
                    <template slot="title">
                      <div class="flex-row align-items-center">
                        <div
                          class="item_left"
                          @click="AvatarClick(item.member_id)"
                          @click.prevent.stop
                        >
                          <el-avatar
                            shape="square"
                            class="user_icon"
                            :src="item.avatar"
                          ></el-avatar>
                          <div
                            class="flex-row align-items-center"
                            style="margin:10px 0"
                          >
                            <div class="view_box">
                              <i class="el-icon-view"></i>
                              {{ item.views }}
                            </div>
                            <div
                              class="flex-row align-items-center"
                              @click="
                                item.followed
                                  ? Unfollow(item.member_id)
                                  : PostMemberFollow(
                                      item.member_id,
                                      item.is_self
                                    )
                              "
                              @click.prevent.stop
                            >
                              <el-rate
                                :value="item.followed ? 1 : 0"
                                :max="1"
                              ></el-rate>
                              <span>{{
                                item.followed ? "已关注" : "关注"
                              }}</span>
                            </div>
                          </div>
                          <div>{{ item.updated_at }}</div>
                        </div>
                        <div>
                          <div class="flex-row align-items-center">
                            <div class="nickname">{{ item.nickname }}</div>
                            <div class="flex-row align-items-center">
                              <!-- <img src="../../assets/gold_icon.png" alt=""> -->
                              <img
                                class="level_icon"
                                :src="
                                  require(`../../assets/${
                                    item.level == 1
                                      ? 'bronze_icon'
                                      : item.level == 2
                                      ? 'silver_icon'
                                      : item.level == 3
                                      ? 'gold_icon'
                                      : 'default_icon'
                                  }.png`)
                                "
                                alt
                              />
                              <div>{{ item.level_name }}</div>
                            </div>
                          </div>
                          <div class="record">
                            战绩:{{ item.join_count }}中{{ item.success_count }}
                            {{ item.accuracy_ratio }}
                          </div>
                          <div class="flex-row align-items-center">
                            <div class="max">
                              最多连对:{{ item.success_max }}
                            </div>
                            <div class="max">最多连错:{{ item.fail_max }}</div>
                            <div class="max">{{ item.submit_value }}</div>
                          </div>
                        </div>
                      </div>
                    </template>
                    <div>
                      <el-table
                        :data="tableData"
                        height="200"
                        border
                        style="width: 100%"
                        size="mini"
                        @row-click="ShowBuyMaterialDialog"
                      >
                        <el-table-column
                          prop="stage"
                          label="期数"
                        ></el-table-column>
                        <el-table-column
                          prop="submit_value"
                          label="预测内容"
                        ></el-table-column>
                        <el-table-column
                          prop="results"
                          label="开奖内容"
                        ></el-table-column>
                        <el-table-column prop="state" label="开奖结果">
                          <template slot-scope="scope">
                            <div
                              :style="{
                                color:
                                  scope.row.state == 0
                                    ? 'red'
                                    : scope.row.state == 1
                                    ? 'green'
                                    : '#ccc'
                              }"
                            >
                              <i class="el-icon-time"></i>
                              <span style="margin-left: 10px">{{
                                scope.row.state == 0
                                  ? "待开奖"
                                  : scope.row.state == 1
                                  ? "猜对了"
                                  : "猜错了"
                              }}</span>
                            </div>
                          </template>
                        </el-table-column>
                        <el-table-column
                          prop="created_at"
                          label="时间"
                        ></el-table-column>
                      </el-table>
                      <div style="margin-top:10px;">
                        <el-pagination
                          background
                          layout="prev, pager, next"
                          :total="recordsMeta.total"
                          @current-change="recordCurrentChange($event, 1)"
                          :page-size="10"
                        ></el-pagination>
                      </div>
                    </div>
                  </el-collapse-item>
                </el-collapse>
              </div>
            </div>
            <!-- 经典排行 end -->
          </div>
          <div style="margin-top:20px;">
            <el-pagination
              background
              layout="prev, pager, next"
              :total="meta.total"
              @current-change="handleCurrentChange($event, 0)"
              :page-size="5"
            ></el-pagination>
          </div>
        </div>
        <!-- 热门排行，经典排行列表 end -->
      </div>
    </div>
    <!-- 右边抽屉 -->
    <div class="right_drawer">
      <el-drawer
        title
        :visible.sync="RightDrawer"
        size="40%"
        v-loading="DrawerLoading"
      >
        <template slot="title">
          <div>
            <div class="flex-row align-items-end justify-content-center">
              <div style="margin-right:60px;font-size:32px;">奖金池</div>
              <el-link style="color:red;" :href="bonusRule" target="_blank"
                >规则</el-link
              >
            </div>
          </div>
        </template>
        <div>
          <div class="bonus_amount">{{ BonusData.bonus_amount }}</div>
          <div class="stage">{{ BonusData.stage }}期奖金池</div>
          <div v-if="BonusNumbers!=''">
            <div style="width:80%;margin:0 auto;text-align:left;color:#909399;">
              {{ BonusNumbers.stage }}期预测号码
            </div>
            <div
              class="begging_box flex-row align-items-center justify-content-center"
              style="width:80%;margin:0 auto;"
            >
              <span
                class="begging"
                v-for="(item, index) in BonusNumbers.data"
                :key="index"
                >{{ item.code }}</span
              >
            </div>
          </div>
          <el-table
            :data="BonusListData"
            height="300"
            border
            style="width: 70%;margin:0 auto;margin-top:20px;"
            size="small"
          >
            <el-table-column
              prop="time"
              label="日期"
              width="90"
            ></el-table-column>
            <el-table-column prop="code" label="我的预测号码" width="150">
              <template slot-scope="scope">
                <div class="flex-row align-items-center">
                  {{ scope.row.code }}
                  <!-- <span class="begging table_begging" v-for="item in 30" :key="item">{{item}}</span> -->
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="stage" label="期数" width="100">
              <template slot-scope="scope">
                <div class="flex-row align-items-center">
                  {{ scope.row.stage }}期{{
                    scope.row.state == 0 ? "进行中" : "已结束"
                  }}
                  <!-- <span class="begging table_begging" v-for="item in 30" :key="item">{{item}}</span> -->
                </div>
              </template>
            </el-table-column>
            <el-table-column prop=" mess" label="开奖情况">
              <template slot-scope="scope">
                <div class="flex-row align-items-center">
                  {{
                    scope.row.mess === "" && scope.row.state =="0"
                      ? `待瓜分${BonusData.bonus_amount}奖金池`:scope.row.mess === "" && scope.row.state =="1"?`共瓜分${scope.row.bonus_amount}奖金池`
                      : scope.row.mess
                  }}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="forecast_res" label="状态" width="70">
              <template slot-scope="scope">
                <div class="flex-row align-items-center">
                  {{
                    scope.row.state == 0
                      ? "待开奖"
                      : scope.row.forecast_res == 0
                      ? "未参与"
                      : scope.row.forecast_res == 1
                      ? "结算中"
                      : scope.row.forecast_res == 2
                      ? "中奖了"
                      : "未中奖"
                  }}
                </div>
              </template>
            </el-table-column>
          </el-table>
          <div
            class="flex-column justify-content-center align-items-center"
            style="margin-top:20px;"
          >
            <!-- <div class="bonus_list" v-for="(item,index) in BonusListData" :key="index">
              <div class="list_state">未参加</div>
              <div class="center_content">本期无人参加</div>
              <div class="begging_box flex-row align-items-center justify-content-center">
                <span class="begging" v-for="item in 30" :key="item">{{item}}</span>
              </div>
              <div class="flex-row justify-content-between align-items-center">
                <div class="placeholder">033期结束</div>
                <div class="placeholder">2020-03-31</div>
              </div>
            </div>-->
          </div>
        </div>
        <div style="margin-top:20px;">
          <el-pagination
            background
            layout="prev, pager, next"
            :total="DrawerMeta.total"
            @current-change="DrawerDandleCurrentChange"
            :page-size="10"
          ></el-pagination>
        </div>
      </el-drawer>
    </div>
    <!-- 买料提示框 -->
    <el-dialog
      title="买料"
      :visible.sync="MaterialDialog"
      width="380px"
      center
      :destroy-on-close="true"
    >
      <div>
        <div
          class="flex-row justify-content-between align-items-center lable_item"
        >
          <div>
            收款人:
            <span>{{ Collection }}</span>
          </div>
          <div>
            金额:
            <span>{{ Amount }}</span>
          </div>
        </div>
        <div
          class="flex-row justify-content-between align-items-center lable_item"
        >
          <div>
            我的欢乐豆:
            <span>{{ HappyBean }}</span>
          </div>
          <div></div>
        </div>
        <div
          class="flex-row justify-content-between align-items-center lable_item"
        >
          <div>
            期数:
            <span>{{ Period }}</span>
          </div>
          <div>
            类型:
            <span>{{ Genre }}</span>
          </div>
        </div>
        <div style="color:#F56C6C;">
          <div style="margin:25px 0 10px 0;">买前须知</div>
          <div
            v-html="explain"
            style="white-space: pre-wrap;line-height:25px;text-align:left;"
          ></div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="MaterialDialog = false">取 消</el-button>
        <el-button type="primary" @click="BuyMaterial">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 买料提示框 end -->
    <!-- 买料成功后预测下期号码 -->
    <el-dialog
      title="下期竞猜"
      :visible.sync="centerDialogVisible"
      width="300px"
      center
      @close="ClearCountdown"
    >
      <div>
        <div class="flex-row round_box">
          <span
            class="round round_border"
            :class="forecastNumIndex == index ? 'round_bg' : 'round_border'"
            v-for="index in 49"
            :key="index"
            @click="SelectForecastNum(index)"
            >{{ index }}</span
          >
        </div>
        <div style="text-align : center;color:#F56C6C;">
          选择1个号码参与{{ Period + 1 }}期猜奖
        </div>
        <div class="flex-row align-items-end">
          <div style="color:#C0C4CC;">倒计时结束，则放弃此次参与机会</div>
          <div style="color:#F56C6C;font-size:22px;margin-left:10px;">
            {{ CountdownNumber }}
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="centerDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="ReferForecast">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 买料成功后预测下期号码end -->
    <!-- 发料弹窗 -->
    <el-dialog
      title="发料"
      :visible.sync="DispatchDialog"
      width="400px"
      center
      @close="HideDispatchDialog"
    >
      <div>
        <div
          class="flex-row justify-content-center"
          v-if="DispatchOptions.length > 0"
        >
          <el-cascader
            :key="isResouceShow"
            v-model="DispatchValue"
            :options="DispatchOptions"
            @change="DispatchCascaderChange"
            :props="Props"
          ></el-cascader>
        </div>
        <div class="dialog_content" v-if="DispatchOptions.length > 0">
          <div class="record">
            {{
              DispatchOptions[DispatchValue[0]].sub_arr[DispatchValue[1]].title
            }}
          </div>
          <div class="contest">
            {{
              DispatchOptions[DispatchValue[0]].sub_arr[DispatchValue[1]]
                .submit_value == ""
                ? `第${
                    DispatchOptions[DispatchValue[0]].sub_arr[DispatchValue[1]]
                      .stage
                  }期暂未参赛`
                : `第${
                    DispatchOptions[DispatchValue[0]].sub_arr[DispatchValue[1]]
                      .stage
                  }期：${
                    DispatchOptions[DispatchValue[0]].sub_arr[DispatchValue[1]]
                      .submit_value
                  }`
            }}
          </div>
          <div class="dispatch_ball">
            <span
              class="dispatch_item"
              :class="
                item.selected ? 'dispatch_item_select' : 'dispatch_item_default'
              "
              v-for="(item, index) in DispatchOptions[DispatchValue[0]].sub_arr[
                DispatchValue[1]
              ].option_arr"
              :key="index"
              :data-i="index"
              @click="SelectedBall($event)"
              >{{ item.option }}</span
            >
          </div>
          <div class="flex-row justify-content-between">
            <div class="updated_at">
              {{
                DispatchOptions[DispatchValue[0]].sub_arr[DispatchValue[1]]
                  .updated_at
              }}
            </div>
            <div class="text_right limit">
              还可以选择{{
                DispatchOptions[DispatchValue[0]].sub_arr[DispatchValue[1]]
                  .limit
              }}
            </div>
          </div>
          <div>
            <el-radio-group v-model="radio" @change="FreeRadio">
              <el-radio
                :label="1"
                :disabled="
                  DispatchOptions[DispatchValue[0]].sub_arr[DispatchValue[1]]
                    .locked == 1
                "
                >免费可见</el-radio
              >
              <el-radio
                :label="2"
                :disabled="
                  DispatchOptions[DispatchValue[0]].sub_arr[DispatchValue[1]]
                    .locked == 1
                "
                >付费可见</el-radio
              >
            </el-radio-group>
          </div>
          <div v-if="radio == 2">
            <div class="flex-row align-items-center">
              <div>收费金额</div>
              <el-input
                v-model="TollNumber"
                placeholder
                style="width:100px;margin:5px;"
                size="mini"
                class="text_center"
                :disabled="
                  DispatchOptions[DispatchValue[0]].sub_arr[DispatchValue[1]]
                    .locked == 1
                "
                type="number"
                @input="inputNumber($event,'TollNumber')"
              ></el-input>
              <div>欢乐豆</div>
            </div>
            <div>
              <div>
                热门高手排行：当前最高者{{
                  DispatchOptions[DispatchValue[0]].sub_arr[DispatchValue[1]]
                    .max_join_bidding
                }}，最低{{
                  DispatchOptions[DispatchValue[0]].sub_arr[DispatchValue[1]]
                    .min_join_bidding
                }}
              </div>
              <div class="flex-row align-items-center">
                <div>竞价金额</div>
                <el-input
                  v-model="BidNumber"
                  placeholder="非必填"
                  style="width:100px;margin:5px;"
                  size="mini"
                  class="text_center"
                  type="number"
                  @input="inputNumber($event,'BidNumber')"
                ></el-input>
                <div>欢乐豆</div>
              </div>
            </div>
          </div>
          <div class="explain_box">
            <div class="explain">发料须知</div>
            <div
              class="explain"
              v-html="
                DispatchOptions[DispatchValue[0]].sub_arr[DispatchValue[1]]
                  .explain
              "
            ></div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="DispatchDialog = false">取 消</el-button>
        <el-button type="primary" @click="SubmitOptions" :disabled="loading"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <!-- 发料弹窗end -->
  </div>
</template>

<script>
let page = 1
let page_size = 5
let recordsPage = 1
let DrawerPage = 1
let timer = null
let purchaseId = '' // 买料返回的id
let RecordType = -1
let followingPage = 1 // 关注列表分页
let UserCenterMemberId = '' // 用户id
let BuyType = 1 // 1 默认列表购买  2用户中心战绩列表购买
export default {
  props: {},
  data () {
    return {
      isResouceShow: 0,
      TollNumber: '', // 收费料收费金额
      BidNumber: '', // 竞价金额
      radio: 1,
      DispatchValue: [0, 0],
      DialogLoading: true,
      Props: {
        value: 'index',
        label: 'name',
        children: 'sub_arr'
      },
      DispatchOptions: [],
      DispatchDialog: false, // 发料弹窗
      UserTabs: '3', // 用户中心tabs
      DrawerLoading: false, // 抽屉loading
      forecastNumIndex: 0, // 预测下期开奖号码
      centerDialogVisible: false, // 买料成功后预测号码弹窗
      userInfo: { avatar: '' }, // 用户信息
      Collection: '', // 收款人昵称
      HappyBean: 0, // 我的欢乐豆
      Period: 0, // 购买的期数
      Genre: '', // 买料类型
      Amount: 0, // 需要支付的金额
      MaterialId: '', // 预测id
      MaterialDialog: false,
      RightDrawer: false,
      FirstLevelRadio: 0,
      SecondaryRadio: 0,
      LevelIndex: 0,
      SortIndexRadio: 0,
      StatusIndexRadio: 0,
      ViewIndexRadio: 0,
      activeNames: [-1],
      HotMasterActiveNames: [-1],
      typeList: [
        {
          name: '',
          sub_arr: [{
            name: ''
          }]
        }
      ],
      HotMasterList: [],
      ClassicMasterList: [],
      loading: true,
      value1: null,
      meta: {
        total: 0
      },
      hotMeta: {
        total: 0
      },
      recordsMeta: {
        total: 0
      },
      BonusData: {
        bonus_amount: 0
      },
      DrawerMeta: {
        total: 0
      },
      tableData: [],
      bonusRule: '',
      MasterRule: '',
      BonusListData: [],
      BonusNumbers: '',
      explain: '', // 买料须知
      CountdownNumber: 90, // 倒计时时间
      MasterCenterDetail: {}, // 高手详情
      FollowingData: [],
      FollowingMeta: {
        total: 0
      }, // 详情列表分页
      UserCenterTypeFirst: 0, // 用户中心战绩类型 第一类型
      UserCenterTypeSecond: 0, // 用户中心战绩类型 第二类型
      UserCenterTableData: [], // 用户中心表格数据
      PurchasesData: [], // 用户买料数据
      PublishData: [] // 用户卖料数据
    }
  },
  computed: {},
  created () {
    this.getSystem()
    this.getBonus()
    this.MasterLitsType()
    this.getUserInfo()
    UserCenterMemberId = this.$store.state.Member.UserId
    // this.GetMemberFollowing(UserCenterMemberId);
  },
  mounted () {},
  watch: {},
  methods: {
    //   校验输入的数字是否为负数
    inputNumber (val, type) {
      console.log(val)
      if (val < 1 && type == 'TollNumber' && val != '') {
        this.TollNumber = 1
      }
      if (val < 1 && type == 'BidNumber' && val != '') {
        this.BidNumber = 1
      }
    },
    ShowClearRecordDialog () {
      //   清除战绩
      console.log('清除战绩')
      this.loading = true
      this.CleanRecord()
    },
    //   隐藏发料弹窗
    HideDispatchDialog () {
      this.DispatchDialog = false
      this.DispatchValue = [0, 0]
      this.isResouceShow = 0
      this.BidNumber = ''
    },
    //   显示发料弹窗
    ShowDispatchDialog () {
      this.loading = true
      this.GetDispatchList()
    },
    //   提交选项
    SubmitOptions () {
      this.$message.closeAll()
      //   if (
      //     this.DispatchOptions[this.DispatchValue[0]].sub_arr[
      //       this.DispatchValue[1]
      //     ].locked == 1
      //   ) {
      //     this.$message.error("收费料不可修改");
      //     return false;
      //   }
      if (
        this.DispatchOptions[this.DispatchValue[0]].sub_arr[
          this.DispatchValue[1]
        ].limit > 0
      ) {
        this.$message.error(
          `还需要选择${
            this.DispatchOptions[this.DispatchValue[0]].sub_arr[
              this.DispatchValue[1]
            ].limit
          }个`
        )
        return false
      }
      console.log(typeof this.TollNumber)

      if ((this.TollNumber == '' || this.TollNumber < 1) && this.radio == 2) {
        this.$message.error('请输入收费金额')
        return false
      }
      if (this.radio == 2 && this.BidNumber != '' && this.TollNumber < 1) {
        this.$message.error('请输入竞价金额')
        return false
      }
      this.loading = true
      this.PostReleaseMaterial()
    },
    // 判断是否可以设置收费
    FreeRadio (val) {
      if (
        this.DispatchOptions[this.DispatchValue[0]].sub_arr[
          this.DispatchValue[1]
        ].locked == 1
      ) {
        return false
      }
      if (
        !this.DispatchOptions[this.DispatchValue[0]].sub_arr[
          this.DispatchValue[1]
        ].charge_allow
      ) {
        this.$message.closeAll()
        this.$message(
          this.DispatchOptions[this.DispatchValue[0]].sub_arr[
            this.DispatchValue[1]
          ].message
        )
        this.radio = 1
        return false
      }
      this.radio = val
    },
    //   选择需要的选项
    SelectedBall (e) {
      console.log(e.target.dataset.i)
      ++this.isResouceShow
      if (
        this.DispatchOptions[this.DispatchValue[0]].sub_arr[
          this.DispatchValue[1]
        ].locked == 1
      ) {
        this.$message.closeAll()
        this.$message('收费料不可更改！')
        return false
      }
      if (
        !this.DispatchOptions[this.DispatchValue[0]].sub_arr[
          this.DispatchValue[1]
        ].option_arr[e.target.dataset.i].selected &&
        this.DispatchOptions[this.DispatchValue[0]].sub_arr[
          this.DispatchValue[1]
        ].limit == 0
      ) {
        return
      }
      if (
        this.DispatchOptions[this.DispatchValue[0]].sub_arr[
          this.DispatchValue[1]
        ].option_arr[e.target.dataset.i].selected
      ) {
        this.DispatchOptions[this.DispatchValue[0]].sub_arr[
          this.DispatchValue[1]
        ].limit =
          Number(
            this.DispatchOptions[this.DispatchValue[0]].sub_arr[
              this.DispatchValue[1]
            ].limit
          ) + 1
      }
      if (
        this.DispatchOptions[this.DispatchValue[0]].sub_arr[
          this.DispatchValue[1]
        ].limit > 0 &&
        !this.DispatchOptions[this.DispatchValue[0]].sub_arr[
          this.DispatchValue[1]
        ].option_arr[e.target.dataset.i].selected
      ) {
        this.DispatchOptions[this.DispatchValue[0]].sub_arr[
          this.DispatchValue[1]
        ].limit =
          Number(
            this.DispatchOptions[this.DispatchValue[0]].sub_arr[
              this.DispatchValue[1]
            ].limit
          ) - 1
      }
      this.DispatchOptions[this.DispatchValue[0]].sub_arr[
        this.DispatchValue[1]
      ].option_arr[e.target.dataset.i].selected = !this.DispatchOptions[
        this.DispatchValue[0]
      ].sub_arr[this.DispatchValue[1]].option_arr[e.target.dataset.i].selected
    },

    // 级联选择器事件
    DispatchCascaderChange (value) {
      console.log(value)
      ++this.isResouceShow
      this.radio =
        this.DispatchOptions[this.DispatchValue[0]].sub_arr[
          this.DispatchValue[1]
        ].locked == 1
          ? 2
          : 1
      this.TollNumber =
        this.DispatchOptions[this.DispatchValue[0]].sub_arr[
          this.DispatchValue[1]
        ].locked == 1
          ? this.DispatchOptions[this.DispatchValue[0]].sub_arr[
            this.DispatchValue[1]
          ].charge_amount
          : ''
      let count = 0
      for (let i = 0; i < this.DispatchOptions[this.DispatchValue[0]].sub_arr[this.DispatchValue[1]].option_arr.length; i++) {
        // console.log(this.DispatchOptions[this.DispatchValue[0]].sub_arr[this.DispatchValue[1]].option_arr[i])
        if (this.DispatchOptions[this.DispatchValue[0]].sub_arr[this.DispatchValue[1]].option_arr[i].selected) {
          ++count
        }
        if (count == this.DispatchOptions[this.DispatchValue[0]].sub_arr[this.DispatchValue[1]].limit) {
          console.log(count)
          this.DispatchOptions[this.DispatchValue[0]].sub_arr[this.DispatchValue[1]].limit = 0
          break
        }
      }
    },
    //   用户中心类型选择 第一类型
    UserCenterTypeSelectFirst (index) {
      this.loading = true
      this.UserCenterTypeFirst = index
      this.UserCenterTypeSecond = 0
      this.UserGetMasterRecords()
      this.GetMasterDetail(UserCenterMemberId, this.typeList[this.UserCenterTypeFirst].sub_arr[this.UserCenterTypeSecond].id)
    },
    //   用户中心类型选择 第二类型
    UserCenterTypeSelectSecond (index) {
      this.loading = true
      this.UserCenterTypeSecond = index
      this.UserGetMasterRecords()
      this.GetMasterDetail(UserCenterMemberId, this.typeList[this.UserCenterTypeFirst].sub_arr[this.UserCenterTypeSecond].id)
    },
    //   获取自己的详情
    GetMineDetail () {
      UserCenterMemberId = this.$store.state.Member.UserId
      this.UserCenterGetMasterDetail(UserCenterMemberId)
    },
    //   关注/粉丝列表获取详情
    UserCenterGetMasterDetail (memberid) {
      UserCenterMemberId = memberid
      followingPage = 1
      this.UserTabs = '3'
      this.loading = true
      this.UserCenterTypeFirst = 0
      this.UserCenterTypeSecond = 0
      this.GetMasterDetail(memberid, this.typeList[0].sub_arr[0].id)
    },
    // 点击头像获取详情
    AvatarClick (memberid) {
      this.UserTabs = '3'
      this.loading = true
      document.body.scrollTo = 0
      document.documentElement.scrollTop = 0
      followingPage = 1
      UserCenterMemberId = memberid
      this.UserCenterTypeFirst = 0
      this.UserCenterTypeSecond = 0
      this.GetMasterDetail(
        memberid,
        this.typeList[this.FirstLevelRadio].sub_arr[this.SecondaryRadio].id
      )
    },
    // 点击tabs页切换
    TabsClick (e) {
      console.log(e.name)
      followingPage = 1
      this.FollowingMeta.total = 0
      this.loading = true
      //   Number(e.name) === 1
      //     ? this.GetMemberFollowing(UserCenterMemberId)
      //     : Number(e.name) === 2
      //     ? this.GetMemberFans(UserCenterMemberId)
      //     : "";
      switch (Number(e.name)) {
        case 1:
          this.GetMemberFollowing(UserCenterMemberId)
          break
        case 2:
          this.GetMemberFans(UserCenterMemberId)
          break
        case 3:
          this.UserCenterTypeFirst = 0
          this.UserCenterTypeSecond = 0
          this.UserGetMasterRecords()
          break
        case 4:
          this.GetPurchases()
          break
        case 5:
          this.GetPublish()
          break
      }
    },
    // 用户中心分页事件
    UserCenterPaginationChange (val) {
      console.log(val)
      followingPage = val
      this.loading = true
      switch (Number(this.UserTabs)) {
        case 1:
          this.GetMemberFollowing(UserCenterMemberId)
          break
        case 2:
          this.GetMemberFans(UserCenterMemberId)
          break
        case 3:
          this.UserGetMasterRecords()
          break
        case 4:
          this.GetPurchases()
          break
        case 5:
          this.GetPublish()
          break
      }
    },
    //   提交预测号码
    ReferForecast () {
      if (this.forecastNumIndex == 0) {
        this.$message.closeAll()
        this.$message.error('请选择预测号码！')
        return false
      }
      this.PostBonusForecast()
    },
    //   选择预测号码
    SelectForecastNum (index) {
      this.forecastNumIndex = index
    },
    // 用户中心买料弹窗
    UserCenterShowBuyMaterialDialog (row, column, event) {
      this.Collection = this.MasterCenterDetail.nickname
      //   this.MaterialDialog = true;
      this.ShowBuyMaterialDialog(row, column, event, 2)
    },
    // 显示买料弹窗
    ShowBuyMaterialDialog (row, column, event, buyType = '') {
      buyType != undefined && buyType != '' ? (BuyType = buyType) : 1
      console.log(row)
      if (
        Number(this.HappyBean) < Number(row.charge_amount) &&
        row.state === '0'
      ) {
        this.$message.closeAll()
        this.$message.error('余额不足')
        return
      }
      //   console.log(row);
      if (row.locked === '1' && row.state === '0' && row.need_pay) {
        // this.Collection = this.MasterCenterDetail.nickname
        this.MaterialDialog = true
        // this.HappyBean = 0; //我的欢乐豆
        this.Period = Number(row.full_stage) // 购买的期数
        this.Genre = row.category_name // 买料类型
        this.Amount = row.charge_amount // 需要支付的金额
        this.MaterialId = row.id
        // console.log("买料");
      }
    },
    BuyMaterial () {
      this.loading = true
      this.MaterialDialog = false
      this.PurchaseBuy()
    },
    //   显示右边抽屉
    ShowRightDrawer () {
      this.DrawerLoading = true
      this.RightDrawer = true
      this.GetBonusNumbers()
      this.GetBonusList()
    },
    //   右边抽屉分页事件
    DrawerDandleCurrentChange (val) {
      DrawerPage = val
      this.GetBonusList()
    },
    // 预测记录分页事件
    recordCurrentChange (e, type) {
      console.log(e, type)
      recordsPage = e
      RecordType = type
      this.MasterRecords(type)
    },
    // 经典排行分页事件
    handleCurrentChange (val, type) {
      console.log(val)
      this.loading = true
      page = val
      this.recordsPage = 1
      this.activeNames = -1
      this.HotMasterActiveNames = -1
      this.tableData = []
      this.MasterLits(type)
    },
    // 改变一级类型
    FirstLevelChange (e) {
      // console.log(e)
      this.LevelIndex = e
      this.SecondaryRadio = 0
      this.SortIndexRadio = 0
      this.StatusIndexRadio = 0
      this.ViewIndexRadio = 0
      this.meta.total = 0
      this.activeNames = -1
      this.HotMasterActiveNames = -1
      page = 1
      this.loading = true
      this.MasterLits(0)
      this.MasterLits(1)
    },
    // SecondaryRadioChange() {
    //   page = 1;
    //   this.loading = true;
    //   this.MasterLits(0);
    //   this.MasterLits(1);
    // },
    SortOrViewOrStatusRadioChange () {
      page = 1
      this.meta.total = 0
      this.activeNames = -1
      this.HotMasterActiveNames = -1
      this.loading = true
      this.MasterLits(0)
      this.MasterLits(1)
    },
    // 经典排行折叠面板事件
    handleChange (e) {
      console.log(e)
      this.Collection = e === '' ? '' : this.ClassicMasterList[e].nickname // 收款人昵称
      this.loading = e !== ''
      this.HotMasterActiveNames = -1
      e === '' ? '' : this.MasterRecords(1)
      //    this.ClassicMasterList[this.activeNames].member_id
      //   : this.HotMasterList[this.HotMasterActiveNames].member_id
      // this.typeList[this.FirstLevelRadio].sub_arr[this.SecondaryRadio].id
      //   e === ""
      //     ? ""
      //     : this.GetMasterDetail(
      //         this.ClassicMasterList[this.activeNames].member_id,
      //         this.typeList[this.FirstLevelRadio].sub_arr[this.SecondaryRadio].id
      //       );
    },
    // 热门高手排行折叠面板事件
    HotMasterHandleChange (e) {
      this.Collection = e === '' ? '' : this.HotMasterList[e].nickname // 收款人昵称
      this.loading = e !== ''
      this.activeNames = -1
      e === '' ? '' : this.MasterRecords(2)
      //   e === ""
      //     ? ""
      //     : this.GetMasterDetail(
      //         this.HotMasterList[this.HotMasterActiveNames].member_id,
      //         this.typeList[this.FirstLevelRadio].sub_arr[this.SecondaryRadio].id
      //       );
    },
    // CleanRecorDeletes 清除战绩
    CleanRecord () {
      let rsaStr = `category_id=${this.typeList[this.UserCenterTypeFirst].sub_arr[this.UserCenterTypeSecond].id}`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http.CleanRecorDeletes(rsaCode).then(res => {
          this.loading = false
          if (res.data.errno === '000') {
            // this.PurchasesData = res.data.result.data;
            // this.FollowingMeta = res.data.result.meta;
            // this.DispatchDialog = false;
            this.$message.success(res.data.errmsg)
            // this.loading = false;
            this.UserCenterTableData = []
            this.FollowingMeta.total = 0
            this.GetMasterDetail(UserCenterMemberId, this.typeList[this.UserCenterTypeFirst].sub_arr[this.UserCenterTypeSecond].id)
          } else {
            // this.FollowingMeta.total = 0;
            // this.PurchasesData = [];
            this.$message.error(res.data.errmsg)
          }
        })
      })
    },
    // 发料
    PostReleaseMaterial () {
      // DispatchReleasePost
      let submit_value = ''
      let count = 0
      let data = this.DispatchOptions[this.DispatchValue[0]].sub_arr[
        this.DispatchValue[1]
      ]
      for (let i = 0; i < data.option_arr.length; i++) {
        if (data.option_arr[i].selected) {
          ++count
          if (data.most == 1 || submit_value == '') {
            submit_value = data.option_arr[i].option
          } else {
            submit_value = submit_value + ',' + data.option_arr[i].option
          }
        }
      }
      //   console.log(submit_value);
      let rsaStr = `category_id=${
        data.id
      }&submit_value=${submit_value}&charge_type=${this.radio}&charge_amount=${
        this.TollNumber == '' ? 0 : this.TollNumber
      }&join_bidding=${this.BidNumber == '' ? 0 : this.BidNumber}`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http.DispatchReleasePost(rsaCode).then(res => {
          this.loading = false
          if (res.data.errno === '000') {
            // this.PurchasesData = res.data.result.data;
            // this.FollowingMeta = res.data.result.meta;
            this.DispatchDialog = false
            this.$message.success(res.data.errmsg)
          } else {
            // this.FollowingMeta.total = 0;
            // this.PurchasesData = [];
            this.$message.error(res.data.errmsg)
          }
        })
      })
    },
    // 获取发料列表
    GetDispatchList () {
      let rsaStr = `timestamp=${new Date()}}`
      let count = 0
      this.$getCode(rsaStr).then(rsaCode => {
        this.http.DispatchListGet(rsaCode).then(res => {
          this.loading = false
          if (res.data.errno === '000') {
            let data = []
            // this.DispatchOptions = res.data.result.data;
            for (let i = 0; i < res.data.result.data.length; i++) {
              // this.DispatchOptions.push()
              data.push({
                index: i,
                id: res.data.result.data[i].id,
                name: res.data.result.data[i].name,
                sub_arr: []
              })
              for (let j = 0; j < res.data.result.data[i].sub_arr.length; j++) {
                data[i].sub_arr.push({
                  index: j,
                  most: res.data.result.data[i].sub_arr[j].limit,
                  ...res.data.result.data[i].sub_arr[j]
                })
                this.radio =
                  res.data.result.data[i].sub_arr[j].locked == 1 ? 2 : 1
                this.TollNumber =
                  res.data.result.data[i].sub_arr[j].locked == 1
                    ? res.data.result.data[i].sub_arr[j].charge_amount
                    : ''
                // for (let k = 0; k < data[i].sub_arr[j].option_arr.length; k++) {
                //   if (data[i].sub_arr[j].option_arr[k].selected) {
                //     ++count;
                //     // console.log("limit", data[i].sub_arr[j].limit);
                //     data[i].sub_arr[j].limit =
                //       count == data[i].sub_arr[j].limit ? 0 : count;
                //     // console.log(count);
                //   }
                // }
                // data.push({ index: i, id:res.data.result.data[i].id,name:res.data.result.data[i].name,sub_arr:[{index:j,...res.data.result.data[i].sub_arr[j]}]});
              }
            }
            this.DispatchOptions = data
            for (let i = 0; i < this.DispatchOptions[this.DispatchValue[0]].sub_arr[this.DispatchValue[1]].option_arr.length; i++) {
              // console.log(this.DispatchOptions[this.DispatchValue[0]].sub_arr[this.DispatchValue[1]].option_arr[i])
              if (this.DispatchOptions[this.DispatchValue[0]].sub_arr[this.DispatchValue[1]].option_arr[i].selected) {
                ++count
              }
              if (count == this.DispatchOptions[this.DispatchValue[0]].sub_arr[this.DispatchValue[1]].limit) {
                console.log(count)
                this.DispatchOptions[this.DispatchValue[0]].sub_arr[this.DispatchValue[1]].limit = 0
                break
              }
            }
            this.DispatchDialog = true
            ++this.isResouceShow
            // console.log(data);
          } else {
            this.DispatchOptions = []
            this.$message.error(res.data.errmsg)
          }
        })
      })
    },
    // 获取用户买料数据
    GetPurchases () {
      let rsaStr = `page=${followingPage}&page_size=${page_size}`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http.PurchasesGet(rsaCode).then(res => {
          this.loading = false
          this.$message.closeAll()
          if (res.data.errno === '000') {
            this.PurchasesData = res.data.result.data
            this.FollowingMeta = res.data.result.meta
          } else {
            this.FollowingMeta.total = 0
            this.PurchasesData = []
            this.$message.error(res.data.errmsg)
          }
        })
      })
    },
    // 获取用户卖料数据
    GetPublish () {
      let rsaStr = `page=${followingPage}&page_size=${page_size}`
      console.log(rsaStr)
      this.$getCode(rsaStr).then(rsaCode => {
        this.http.PublishGet(rsaCode).then(res => {
          this.loading = false
          this.$message.closeAll()
          if (res.data.errno === '000') {
            this.PublishData = res.data.result.data
            this.FollowingMeta = res.data.result.meta
          } else {
            this.FollowingMeta.total = 0
            this.PublishData = []
            this.$message.error(res.data.errmsg)
          }
        })
      })
    },
    // 用户中心获取战绩
    UserGetMasterRecords () {
      let rsaStr = `member_id=${UserCenterMemberId}&category_id=${
        this.typeList[this.UserCenterTypeFirst].sub_arr[
          this.UserCenterTypeSecond
        ].id
      }&page=${followingPage}&page_size=${page_size}`
      console.log(rsaStr)
      this.$getCode(rsaStr).then(rsaCode => {
        this.http.getMasterRecords(rsaCode).then(res => {
          this.$message.closeAll()
          this.loading = false
          if (res.data.errno === '000') {
            this.UserCenterTableData = res.data.result.data
            this.FollowingMeta = res.data.result.meta
            this.explain = res.data.result.explain
          } else {
            this.UserCenterTableData = []
            this.FollowingMeta.total = 0
            this.$message.error(res.data.errmsg)
          }
        })
      })
    },
    // 买料
    PurchaseBuy () {
      let rsaStr = `id=${this.MaterialId}`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http.BuyPurchase(rsaCode).then(res => {
          this.$message.closeAll()
          BuyType == 1
            ? this.MasterRecords(RecordType)
            : this.UserGetMasterRecords()
          this.getUserInfo()
          //   this.
          if (res.data.errno === '000') {
            purchaseId = res.data.result.data.id
            this.centerDialogVisible = true
            this.Countdown()
            this.$message.success(res.data.errmsg)
          } else {
            this.$message.error(res.data.errmsg)
          }
        })
      })
    },
    // 用户关注
    PostMemberFollow (member_id, iSelf, type = '') {
      this.$message.closeAll()
      if (iSelf) {
        this.$message.error('不能关注自己!')
        return false
      }
      this.loading = true
      // FollowMember
      let rsaStr = `member_id=${member_id}`
      // console.log(rsaStr)
      this.$getCode(rsaStr).then(rsaCode => {
        this.http.FollowMember(rsaCode).then(res => {
          if (type === 'usercenter') {
            Number(this.UserTabs) === 1
              ? this.GetMemberFollowing(UserCenterMemberId)
              : this.GetMemberFans(UserCenterMemberId)
            this.GetMasterDetail(
              UserCenterMemberId,
              this.typeList[this.FirstLevelRadio].sub_arr[this.SecondaryRadio]
                .id
            )
          } else {
            this.MasterLits(0)
            this.MasterLits(1)
          }
          this.$message.closeAll()
          if (res.data.errno === '000') {
            if (UserCenterMemberId === this.$store.state.Member.UserId) {
              this.MasterCenterDetail.following =
                Number(this.MasterCenterDetail.following) + 1
            }
            this.$message.success(res.data.errmsg)
          } else {
            this.$message.error(res.data.errmsg)
          }
        })
      })
    },
    // 获取下期预测号码
    GetBonusNumbers () {
      let rsaStr = `timestamp=${new Date()}`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http.BonusNumbers(rsaCode).then(res => {
          if (res.data.errno === '000') {
            this.BonusNumbers = res.data.result
            // this.BonusListData = res.data.result.data;
            // this.DrawerMeta = res.data.result.meta;
            // this.$message.success(res.data.errmsg);
          } else {
            // this.$message.error(res.data.errmsg);
          }
        })
      })
    },
    // 获取奖金池记录
    GetBonusList () {
      let rsaStr = `page=${DrawerPage}&page_size=${10}`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http.BonusList(rsaCode).then(res => {
          this.DrawerLoading = false
          if (res.data.errno === '000') {
            this.BonusListData = res.data.result.data
            this.DrawerMeta = res.data.result.meta
            // this.$message.success(res.data.errmsg);
          } else {
            this.$message.error(res.data.errmsg)
          }
        })
      })
    },
    // 取消关注
    Unfollow (member_id, iSelf, type = '') {
      console.log(member_id, iSelf, type)
      this.$message.closeAll()
      if (iSelf) {
        this.$message.error('不能关注自己!')
        return false
      }
      let rsaStr = `member_id=${member_id}`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http.UnFollowMember(rsaCode).then(res => {
          if (type === 'usercenter') {
            Number(this.UserTabs) === 1
              ? this.GetMemberFollowing(UserCenterMemberId)
              : this.GetMemberFans(UserCenterMemberId)
            this.GetMasterDetail(
              UserCenterMemberId,
              this.typeList[this.FirstLevelRadio].sub_arr[this.SecondaryRadio]
                .id
            )
          } else {
            this.MasterLits(0)
            this.MasterLits(1)
          }
          if (res.data.errno === '000') {
            if (UserCenterMemberId === this.$store.state.Member.UserId) {
              this.MasterCenterDetail.following =
                Number(this.MasterCenterDetail.following) - 1
            }
            this.$message.success(res.data.errmsg)
          } else {
            this.$message.error(res.data.errmsg)
          }
        })
      })
    },
    // 点赞
    MemberLikePost () {
      this.$message.closeAll()
      if (this.MasterCenterDetail.is_self) {
        this.$message.error('不能给自己点赞')
        return false
      }
      let rsaStr = `member_id=${UserCenterMemberId}`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http.MemberLike(rsaCode).then(res => {
          if (res.data.errno === '000') {
            this.MasterCenterDetail.likes =
              Number(this.MasterCenterDetail.likes) + 1
            this.$message.success(res.data.errmsg)
            this.MasterCenterDetail.liked = true
          } else {
            this.$message.error(res.data.errmsg)
          }
        })
      })
    },
    // 取消点赞
    MemberUnLikeDeletes () {
      this.$message.closeAll()
      if (this.MasterCenterDetail.is_self) {
        // this.$message.error('');
        return false
      }
      let rsaStr = `member_id=${UserCenterMemberId}`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http.MemberUnLike(rsaCode).then(res => {
          if (res.data.errno === '000') {
            this.MasterCenterDetail.likes =
              Number(this.MasterCenterDetail.likes) - 1
            this.MasterCenterDetail.liked = false
            this.$message.success(res.data.errmsg)
          } else {
            this.$message.error(res.data.errmsg)
          }
        })
      })
    },
    // 增加浏览量 AddListView
    listViewCountAdd (memberId) {
      let rsaStr = `member_id=${memberId}`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http.AddListView(rsaCode).then(res => {
          if (res.data.errno === '000') {
            this.MasterLits(0)
            this.MasterLits(1)
          }
        })
      })
    },
    // 获取高手榜列表
    MasterLits (joinBiddingType) {
      // joinBiddingType = 0 / 1  0为经典排行 1为热门高手
      let rsaStr = `join_bidding=${joinBiddingType}&category_id=${
        this.typeList[this.FirstLevelRadio].sub_arr[this.SecondaryRadio].id
      }&charge_type=${this.StatusIndexRadio}&view_type=${
        this.ViewIndexRadio
      }&order=${
        this.SortIndexRadio == 0 ? 'created_at' : 'accuracy_ratio'
      }&page=${page}&page_size=${page_size}`
      //   console.log(rsaStr);
      this.$getCode(rsaStr).then(rsaCode => {
        this.http
          .getMasterLits(rsaCode)
          .then(res => {
            this.loading = false
            if (res.data.errno === '000') {
              // this.typeList = res.data.result.data;
              switch (joinBiddingType) {
                case 0:
                  this.meta = res.data.result.meta
                  this.ClassicMasterList = res.data.result.data
                  break
                case 1:
                  this.hotMeta = res.data.result.meta
                  this.HotMasterList = res.data.result.data
                  break
              }
            } else {
              joinBiddingType == 0
                ? (this.ClassicMasterList = [])
                : (this.HotMasterList = [])
              this.$message.closeAll()
              this.$message.error(res.data.errmsg)
            }
          })
          .catch(err => {
            // console.log(err);
          })
      })
    },
    // 获取高手榜类型
    MasterLitsType () {
      let rsaStr = `page=1&page_size=999`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http
          .getMasterLitsType(rsaCode)
          .then(res => {
            if (res.data.errno === '000') {
              this.typeList = res.data.result.data
              this.GetMasterDetail(
                this.$store.state.Member.UserId,
                res.data.result.data[0].sub_arr[0].id
              )
              this.MasterLits(0)
              this.MasterLits(1)
              this.UserGetMasterRecords()
            } else {
              this.$message.closeAll()
              this.$message.error(res.data.errmsg)
            }
          })
          .catch(err => {
            // console.log(err);
          })
      })
    },
    // 获取奖金池金额
    getBonus () {
      let rsaStr = `timestamp=${Number(new Date())}`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http
          .getBonus(rsaCode)
          .then(res => {
            if (res.data.errno === '000') {
              this.BonusData = res.data.result.data
            } else {
              this.$message.closeAll()
              this.$message.error(res.data.errmsg)
            }
          })
          .catch(err => {
            // console.log(err);
          })
      })
    },
    // 获取高手预测记录
    MasterRecords (type) {
      let rsaStr = `member_id=${
        type == 1
          ? this.ClassicMasterList[this.activeNames].member_id
          : this.HotMasterList[this.HotMasterActiveNames].member_id
      }&category_id=${
        this.typeList[this.FirstLevelRadio].sub_arr[this.SecondaryRadio].id
      }&page=${recordsPage}&page_size=10`
      //   console.log(rsaStr)
      this.$getCode(rsaStr).then(rsaCode => {
        this.http
          .getMasterRecords(rsaCode)
          .then(res => {
            this.loading = false
            if (res.data.errno === '000') {
              let memberId =
                type == 1
                  ? this.ClassicMasterList[this.activeNames].member_id
                  : this.HotMasterList[this.HotMasterActiveNames].member_id
              this.listViewCountAdd(memberId)
              this.tableData = res.data.result.data
              this.recordsMeta = res.data.result.meta
              this.explain = res.data.result.explain
              //   this.BonusData = res.data.result.data;
            } else {
              this.tableData = []
              this.$message.closeAll()
              this.$message.error(res.data.errmsg)
            }
          })
          .catch(err => {
            // console.log(err);
          })
      })
    },
    // 获取规则地址链接
    getSystem () {
      let rsaStr = `timestamp=${Number(new Date())}`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http
          .getsystem(rsaCode)
          .then(res => {
            if (res.data.errno === '000') {
              this.bonusRule = res.data.result.data.bonus_rule
              this.MasterRule = res.data.result.data.master_rule
            }
          })
          .catch(err => {
            // console.log(err);
          })
      })
    },
    // 获取用户信息
    getUserInfo () {
      let rsaStr = `uuid=${sessionStorage.getItem('u')}`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http
          .getUserInfo(rsaCode)
          .then(res => {
            if (res.data.errno === '000') {
              this.userInfo = res.data.result.data
              this.HappyBean = res.data.result.data.integral
            }
          })
          .catch(err => {
            // console.log(err);
          })
      })
    },
    // bonus/forecast
    PostBonusForecast () {
      let rsaStr = `purchase_id=${purchaseId}&code=${this.forecastNumIndex}`
      //   console.log(rsaStr)
      this.$getCode(rsaStr).then(rsaCode => {
        this.http
          .BonusForecast(rsaCode)
          .then(res => {
            if (res.data.errno === '000') {
              this.$message.success(res.data.errmsg)
              this.ClearCountdown()
            } else {
              this.$message.error(res.data.errmsg)
            }
          })
          .catch(err => {
            // console.log(err);
          })
      })
    },
    // 获取高手详情
    GetMasterDetail (memberId, categoryId) {
      let rsaStr = `member_id=${memberId}&category_id=${categoryId}`
      this.$getCode(rsaStr).then(rsaCode => {
        this.http
          .MasterDetail(rsaCode)
          .then(res => {
            this.loading = false
            if (res.data.errno === '000') {
            //   this.GetMemberFollowing(memberId);
              this.UserGetMasterRecords()
              this.MasterCenterDetail = res.data.result.data
            } else {
              this.$message.error(res.data.errmsg)
            }
          })
          .catch(err => {
            // console.log(err);
          })
      })
    },
    // 获取关注列表
    GetMemberFollowing (memberId) {
      let rsaStr = `member_id=${memberId}&page=${followingPage}&page_size=${page_size}`
      console.log(rsaStr)
      this.$getCode(rsaStr).then(rsaCode => {
        this.http
          .MemberFollowing(rsaCode)
          .then(res => {
            this.loading = false
            if (res.data.errno === '000') {
              this.FollowingData = res.data.result.data
              this.FollowingMeta = res.data.result.meta
            } else {
              this.FollowingData = []
              this.FollowingMeta.total = 0
              this.$message.closeAll()
              this.$message.error(res.data.errmsg)
            }
          })
          .catch(err => {
            // console.log(err);
          })
      })
    },
    // 获取关注列表
    GetMemberFans (memberId) {
      let rsaStr = `member_id=${memberId}&page=${followingPage}&page_size=${page_size}`
      console.log(rsaStr)
      this.$getCode(rsaStr).then(rsaCode => {
        this.http
          .MemberFollowers(rsaCode)
          .then(res => {
            this.loading = false
            if (res.data.errno === '000') {
              this.FollowingData = res.data.result.data
              this.FollowingMeta = res.data.result.meta
            } else {
              this.FollowingData = []
              this.FollowingMeta.total = 0
              this.$message.closeAll()
              this.$message.error(res.data.errmsg)
            }
          })
          .catch(err => {
            // console.log(err);
          })
      })
    },
    // 倒计时
    Countdown () {
      timer = setInterval(() => {
        if (this.CountdownNumber == 0 || this.CountdownNumber < 0) {
          this.ClearCountdown()
        }
        this.CountdownNumber--
      }, 1000)
    },
    // 清除计时器
    ClearCountdown () {
      this.CountdownNumber = 90
      clearInterval(timer)
      this.centerDialogVisible = false
      this.forecastNumIndex = 0
      purchaseId = ''
    }
  },
  components: {}
}
</script>

<style scoped lang="less">
@import url("./index.less");
</style>
<style scoped>
.masterlist .status_box >>> .el-radio {
  margin-right: 15px;
}
.masterlist .list_box >>> .el-collapse-item__header {
  height: auto;
  padding: 20px;
  line-height: 1;
}
.masterlist >>> .el-drawer {
  background: #f5f5f5;
}
.bonus_amount {
  text-align: center;
  font-size: 50px;
  font-weight: bolder;
  margin-bottom: 10px;
  color: #303133;
}
.stage {
  text-align: center;
  font-size: 12px;
  color: #909399;
}
.begging_box {
  margin: 20px 0;
}
.begging {
  display: block;
  background: black;
  border-radius: 100%;
  height: 30px;
  width: 30px;
  margin: 0;
  color: #fff;
  line-height: 30px;
  margin: 5px;
  text-align: center;
  background: radial-gradient(circle at 10px 10px, red, #606266);
}
.list_state {
  text-align: right;
  font-size: 15px;
}
.center_content {
  text-align: center;
  font-size: 18px;
}
.bonus_list {
  width: 80%;
  border-radius: 10px;
  margin: 10px 0;
  /* border: 1px solid #ddd; */
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
  padding: 15px;
  background: #fff;
  box-sizing: border-box;
}
.placeholder {
  color: #c0c4cc;
  font-size: 14px;
}
.table_begging {
  width: 15px;
  height: 15px;
  font-size: 10px;
  line-height: 15px;
}
.fist_type::-webkit-scrollbar {
  /*滚动条整体样式*/
  width: 5px;
  /*高宽分别对应横竖滚动条的尺寸*/
  height: 5px;
}

.fist_type::-webkit-scrollbar-thumb {
  /*滚动条里面小方块*/
  border-radius: 10px;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  background: #409eff;
}

.fist_type::-webkit-scrollbar-track {
  /*滚动条里面轨道*/
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  background: #fff;
}
</style>
